
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<link rel="stylesheet" href="/wk1un9/houTai/lib/layui/css/layui.css" />
</head>
<body>
<form class="layui-form" action="" id="formConsole" method="post">
				
		        <div class="layui-form-item">
					<label class="layui-form-label">商品名称:</label>
					<div class="layui-input-inline" style="width:350px;">
						<input type="text" id="proName" name="proName" required=""  autocomplete="off" class="layui-input">
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-label">材料:</label>
					<div class="layui-input-inline" style="width:350px;">
						<input type="text" id="proMateral" name="proMateral" required=""  autocomplete="off" class="layui-input">
					</div>
				</div>
				
				<div class="layui-form-item">
					<label class="layui-form-label">商品价格:</label>
					<div class="layui-input-inline" style="width:350px;">
						<input type="text" id="salePrice" name="salePrice" required=""  autocomplete="off" class="layui-input">
					</div>
				</div>
				
				<div class="layui-form-item">
					<label class="layui-form-label">市场价:</label>
					<div class="layui-input-inline" style="width:350px;">
						<input type="text" id="marketPrice" name="marketPrice" required=""  autocomplete="off" class="layui-input">
					</div>
				</div>
				
				<div class="layui-form-item">
					<label class="layui-form-label">品牌:</label>
					<div class="layui-input-inline" style="width:350px;">
						<input type="text" id="brand" name="brand" required=""  autocomplete="off" class="layui-input">
					</div>
				</div>
 
				<div class="layui-form-item">
					<label class="layui-form-label">是否加糖:</label>
					<div class="layui-input-inline" style="width:350px;">
						<input type="text" id="zuZhuang" name="zuZhuang" required=""  autocomplete="off" class="layui-input">
					</div>
				</div>
				
				<div class="layui-form-item">
					<label class="layui-form-label">是否定制:</label>
					<div class="layui-input-inline" style="width:350px;">
						<input type="text" id="dingZhi" name="dingZhi" required=""  autocomplete="off" class="layui-input">
			       </div>
			     </div>
			
				<div class="layui-form-item">
					<label class="layui-form-label">奶茶分类:</label>
					<div class="layui-input-inline" style="width:350px;">
						<input type="text" id="model" name="model" required=""  autocomplete="off" class="layui-input">
					</div>
				</div>
				
				<div class="layui-form-item">
					<label class="layui-form-label">元素:</label>
					<div class="layui-input-inline" style="width:350px;">
						<input type="text" id="yuanSu" name="yuanSu" required=""  autocomplete="off" class="layui-input">
					</div>
				</div>
				
				<div class="layui-form-item">
					<label class="layui-form-label">风格:</label>
					<div class="layui-input-inline" style="width:350px;">
						<input type="text" id="styles" name="styles" required=""  autocomplete="off" class="layui-input">
					</div>
				</div>
				
				<div class="layui-form-item">
					<label class="layui-form-label">商品图片:</label>
					<div class="layui-input-inline" style="width:350px;">
					<button type="button" class="layui-btn" id="test1">
                <i class="layui-icon">&#xe67c;</i>上传图片
                  </button>
                     <img id="imgFace" style="width:120px"  src="" />
						<input type="text" id="proUrl" name="proUrl" required=""  autocomplete="off" class="layui-input">
					</div>
				</div>
				
			 <%-- <div class="layui-form-item">
                <label class="layui-form-label">选择框</label>
                          <div class="layui-input-block">
                   <select name="productTypeName" >
                    <c:forEach  items="${fls} " var="f"> 
                  
                      <option value="${f.id}"> ${f.productTypeName} </option>
                  
                      </c:forEach>
                       </select>
                   </div>
               </div> --%>
				
				<div class="layui-form-item">
                <label class="layui-form-label">选择框</label>
                          <div class="layui-input-block">
                   <select name="productTypeName" >
                   
               
                  <c:forEach items="${fls}" var="f"> 
                    <option value="${f.id}">${f.productTypeName}</option>
                  
                  </c:forEach>
                     
                       </select>
                   </div>
               </div> 
				
				<div class="layui-form-item">
				<div class="layui-input-block">
					<button class="layui-btn" lay-submit lay-filter="formDemo">立即提交</button>
					<button type="reset" class="layui-btn layui-btn-primary">重置</button>
				</div>
			</div>
			</form> 
		<script type="text/javascript" src="/wk1un9/houTai/lib/layui/layui.js"></script>
<!-- 		<script>
			//加载了layui的form模块
			layui.use('form', function() {
				var form = layui.form;
				var $ = layui.jquery; //引入jquery
				//监听提交
				form.on('submit(userEditBtu)', function(data) {
					var str = $("#formConsole").serialize();
					//通过ajax向数据库提交数据了
					var url ='/wk1un9/HouTaiProductSrevlet?method=addPro';
					//确保数据没有问题就进行ajax提交了
					$.post(url, str,
						function(data) {
							if(data.count>0){
								console.log('添加成功');
								var index=parent.layer.getFrameIndex(window.name); //获取当前窗口的name
             					 parent.layer.close(index);		//关闭窗口
							}
						}, "json");
					return false;
				});
			});
		</script> -->
		
		<script>
			//加载了layui的form模块
			layui.use(['form','upload'], function() {
				var form = layui.form;
				var $ = layui.jquery; //引入jquery
				 var upload = layui.upload;
					
					//执行实例
					  var uploadInst = upload.render({
					    elem: '#test1' //绑定元素
					    ,url: '/wk1un9/HouTaiProductSrevlet?method=upload' //上传接口
					    ,done: function(res){
					      //上传完毕回调
					      console.log(res);
					 $("#proUrl").val('upload/'+res.data);
					 $("#imgFace").attr('src','/wk1un9/upload/'+res.data);
					    }
					    ,error: function(){
					      //请求异常回调
					    	 
					    }
					  });
				//监听提交
				form.on('submit(formDemo)', function(data) {
					var d = data.field; //表单中的数据，定义一个对象来接收
					//通过ajax向数据库提交数据了
					/* d.method="addPro"; */
					console.log(d); //提交之前的一个数据验证、通过打印的方式先手动的去判断一下这个数据
					var url ='/wk1un9/HouTaiProductSrevlet?method=addPro';
					//确保数据没有问题就进行ajax提交了
					$.post(url, d,
						function(data) {
							if(data.count>0){
								console.log('添加成功');
								var index=parent.layer.getFrameIndex(window.name); //获取当前窗口的name
             					 parent.layer.close(index);		//关闭窗口
							}
						}, "json");
					return false;
				});
			});
		</script>
</body>
</html>



</body>
</html>